<template>
  <div class="box_cont">
    <div>
      <table></table>
      <div class="cont_daiqueren">
        
          <div class="dqr_bg">
              <!-- <img src="/static/img/dqr_bg.png" alt=""> -->
          </div>
          <p class="yifangru">红包已放入账户</p>
          <p class="yishoudao">已收到新人红包 {{atoshiValue}} ATOS</p>
          <div class="yueshoudao">
              <span class="yuedeng">≈</span>
              <span class="money">￥{{rmbValue}}</span>
          </div>
          <div class="bottom">
              <div class="zhanghao">
                  <span class="zhanghu">收款账户</span>

                  <span class="haoma">{{mobile}}</span>
              </div>
              <div class="ljxiazai" @click="toxiazaiye">立即下载APP</div>
          </div>

      </div>
    </div>  
  </div>
</template>

<script>
  import Vue from "vue";
  import MintUI from "mint-ui";
  import { Toast , MessageBox } from "mint-ui";
  Vue.use( MintUI , Toast , MessageBox );

  // cxr 引入路由
  import Router from "vue-router";
  Vue.use(Router);
  export default {
    name: "daiqueren",
    data() {
      return {
        list: [],
        amount:null,
        rmbNum:null,
        atoshiNum:null,
        isshowjine:false,
        mobile:123,
        atoshiValue:null,
        rmbValue:null

      };
    },
    methods: {
      toshowjine () {
        this.isshowjine=true;
      },
      getData() {
        let _this=this;
        _this.axios.post("/api/fakeUser/listFakeUser" ,{number:10}).then(res => {
          if (res.data.code == 100) {
            _this.amount=res.data.data.amount;
            _this.rmbNum=res.data.data.rmbNum;
            _this.atoshiNum=res.data.data.atoshiNum;
            _this.list=res.data.data.users;
          }  else {
            _this.tos(res.data.msg);
          }
        });
      },
      getyqrData(){
        let _this=this
        // console.log(12344)
        _this.axios.post("/api/inviteRecord/getInvitePosterDataForH5",{userId:3}).then(res => {
          // console.log("hhh")
          if (res.data.code == 100) {
            // console.log("haha")
            _this.rmbValue=res.data.data.data.rmbValue;
            _this.atoshiValue=res.data.data.data.atoshiValue;
          }  else {
            _this.tos(res.data.msg)
          }
        });
      },
     
      tos (test) {
        Toast({message: test, position: 'top', duration: 2000});
      },

      //cxr 跳转到红包验证页面 
      toxiazaiye(){
        this.$router.push({path:'/xiazaiye'});
      }
    },
    mounted () {
      // console.log(localStorage.getItem("usermobile"))
      this.mobile=localStorage.getItem("usermobile");
      this.getData();
      this.getyqrData()
    }
  }
</script>

<style lang="scss" scoped>
  @import "src/common/css/mixin";
  $background: #F9C54A;
  .box_cont{
    width:100%;
    min-height: 100vh;
    position:relative;
    .cont_daiqueren{
        width:Rem(375);
        min-height: 100vh;
        margin:Rem(0) auto;
        background:#F5F5F5;
        .dqr_bg{
            width: Rem(375);
            height: Rem(170);
            background:url("/static/img/dqr_bg.png") no-repeat ;
            background-size:100% 100%;
        }
        .yifangru{
            margin-top: Rem(20);
            height: Rem(17);
            line-height: Rem(17);
            text-align: center;
            color: #333333;
            font-size: Rem(18);
            font-family: PingFang-SC-Medium;
        }    
        .yishoudao{
            margin-top: Rem(45);
            height: Rem(14);
            line-height: Rem(17);
            text-align: center;
            color: #666666;
            font-size: Rem(14);
            font-family: PingFang-SC-Medium;
        }
        .yueshoudao{
            
            margin-top: Rem(15);
            text-align: center;
            color: #333333;
            .yuedeng{ 
                font-size: Rem(38);
                font-family: PingFang-SC-Medium;
            }
            .money{ 
                font-size: Rem(30);
                font-family: PingFang-SC-Heavy;
                font-weight: Heavy;

            }
        }
        .bottom{

            box-sizing: border-box;
            margin-top: Rem(50);
            margin-left: Rem(15);
            width: Rem(345);
            height: Rem(190);
            padding: 0 Rem(15) 0;
            background: #FFFFFF;
            
            .zhanghao{
                height: Rem(74);
                line-height: Rem(74);
                border-bottom: solid #F5F5F5 Rem(1);
                .zhanghu{
                    color: #333333;
                    font-size: Rem(15);
                    font-family: PingFang-SC-Medium;
                    margin-right: Rem(6);
                    margin-right: Rem(39);
                }
                .haoma{
                    color: #666666;
                    font-size: Rem(13);
                    font-family: PingFang-SC-Medium;
                }
            }
            .ljxiazai{
                margin-top: Rem(47);
                height: Rem(50);
                background: #22AC38;
                line-height: Rem(50);
                text-align: center;
                font-size: Rem(18);
                font-family: PingFang-SC-Medium;
                color: #FFFEFE;

            }
        }
    } 
  }
  
</style>